<script setup lang="ts" name="index">
import { computed, onMounted } from "vue"
import { useI18n } from "vue-i18n";
const { locale } = useI18n();
// 首屏loading
let lang:any=computed(() => store.lang)
let store = useStore()
let loading = computed(() => store.firstLoading)
onMounted(() => {
  // 关闭首屏loading
  store.$patch({
    firstLoading: false
  })
  // 设置初始化语言
  if (Object.keys(lang.value).length == 0) {
    store.$patch({
      lang: {
        img: "/img/guoqi_01.png",
        name: "English",
        lang: "en",
      }
    })

  }else{
    locale.value=lang.value?.lang
  }
})
</script>

<template>
  <div class="app">
     <div class="bigbox" v-if="loading">
      <img class="bigloading" src="/img/logo.gif" alt="" />
    </div>
    <NuxtLayout name="layout">
      <ClientOnly>
        <NuxtPage />
      </ClientOnly>
    </NuxtLayout>
  </div>
</template>
<style></style>
<style scoped lang="scss">
.app {
  width: 100%;
  height: 100%;
  min-height: 100vh;

  .bigbox {
    background-color: rgb(15, 16, 18);
    position: fixed;
    width: 100vw;
    height: 100vh;
    margin: 0;
    padding: 0;
    left: 0;
    top: 0;
    z-index: 2000;
    // @include flex(row, center, center);

    .bigloading {
      width: 30%;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);

    }
  }
}
</style>
